<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			p {
				width: 50px;
				height: 50px;
				background-color: red;
			}
		</style>
	</head>
	<body>
		<script>
			//https://www.bilibili.com/video/BV1K4411D7Jb?spm_id_from=333.1007.top_right_bar_window_default_collection.content.click&vd_source=1a56e48c63d7ce008832492049f44156

			//宏任务  定时器  
			//微任务   Promise
			/*
				1....
				console.log('1');//第一轮主线程
				setTimeout(() => {
				  console.log('2');  // 将回调代码放入个宏任务队列
				}, 0);
				new Promise((resolve, reject) => {
				  console.log('3-');//第一轮微任务同步执行
				  resolve()
				}).then(()=>{
				  console.log('4'); // 将回调代码放入微任务队列，
				});
				console.log('5');//第一轮主线程结束
				2....
				// 宏任务队列 1
				// setTimeout(() => {
				// 	// 宏任务队列 2.1
				// 	console.log('1');
				// 	setTimeout(() => {
				//   // 宏任务队列 3
				// 		console.log('2')
				// 	}, 0)
				// 	new Promise(resolve => {
				// 		resolve()
				// 		console.log('3')
				// 	}).then(() => {
				// 		// 微任务队列 1
				// 		console.log('4')
				// 	})
				// }, 0)
				
				// setTimeout(() => {
				// 	// 宏任务队列 2.2
				// 	console.log('5')
				// }, 0)
				// console.log('6')
				3....
				async function async1() {
					console.log('1');
					await async2();
					console.log('2');
				}
				async function async2() {
					console.log('3');
				}
				console.log('4');
				setTimeout(function() {
					console.log('5');
				}, 0)
				async1();
				new Promise(function(resolve) {
					console.log('6');
					resolve();
				}).then(function() {
					console.log('7');
				});
				
				4.....
				function userInfo() {
					console.log(1);
					return new Promise((resolve) => {
						setTimeout(() => {
							resolve(`2`);
						}, 2000);
					});
				}
				console.log("3");
				let p1 = new Promise((resolve, reject) => {
					resolve("4");
				});
				let p2 = new Promise((resolve, reject) => {
					resolve("5");
				});
				async function getUserInfo() {
					console.log("6");
					setTimeout(()=>{
						console.log(7);
					},0)
					p1.then((res) => {
						console.log(res);
					});
					var awaitRes = await userInfo();
					console.log(awaitRes); // 接口返回值---------------1
					setTimeout(()=>{
						console.log(8);
					},0)
					p2.then((res) => {
						console.log(res);
					});
					console.log("9");
				}
				console.log("10");
				getUserInfo(); // 异步方法，加入任务队列执行
				console.log("11");
			*/
		</script>
	</body>
</html>
